<template lang="">
  <div>
    <SmallShop :shopurl=" 'https://elm.cangdu.org/img/'+(shops.image_path)" :title="shops.name" :pingfen="shops.rating"
      :qison="shops.float_minimum_order_amount" :peisonfei="shops.float_delivery_fee" :distance="shops.distance"
      :peisonshijian="shops.order_lead_time" :icon_name1="txt1" :icon_name2="txt2" :icon_name3="txt3"
      :monthShow="shops.recent_order_num" :id="shops.id"></SmallShop>
  </div>
</template>

<script>
  import SmallShop from "@/components/SmallShop.vue";
  export default {
    name: "SmallShops_item",
    data() {
      return {
        txt1: "",
        txt2: "",
        txt3: "",
      }
    },
    props: ['shops'],

    mounted() {
      if (this.shops.supports.length == 3) {
        this.txt1 = this.shops.supports[0].icon_name;
        this.txt2 = this.shops.supports[1].icon_name;
        this.txt3 = this.shops.supports[2].icon_name;
      } else if (this.shops.supports.length == 2) {
        this.txt1 = this.shops.supports[0].icon_name;
        this.txt2 = this.shops.supports[1].icon_name;
      } else {
        this.txt1 = this.shops.supports[0].icon_name;
      }
    },
    components: {
      SmallShop,
    }
  }
</script>